import Taro, { useState, useDidShow } from '@tarojs/taro'
import { AtNavBar, AtList, AtListItem, AtButton } from 'taro-ui'
import servicePath from '../../config/apiUrl'
import { View, Text } from '@tarojs/components'



function Goods() {

    const [goodsList, setGoodsList] = useState([])
    const [userName, setuserName] = useState('')


    const clickJump = (id) => {
        Taro.navigateTo({ url: '/pages/goods/goodInfo?id=' + id })
    }

    const jumpToCart = () =>{
        Taro.navigateTo({ url: '/pages/cart/cart' })
    }

    useDidShow(async () => {
        Taro.request({
            url: servicePath.getGoods
        }).then(res => {
            console.log(res.data.data)
            setGoodsList(res.data.data)
        })

        Taro.getStorage({
            key: 'userName',
            success: function (res) {
                console.log('userName=' + res.data)
                setuserName(res.data)
            }
        })
    })

    return (
        <View>
            <AtNavBar
                onClickRgIconSt={jumpToCart}
                onClickRgIconNd={this.handleClick}
                color='#000'
                rightFirstIconType='shopping-cart'
                rightSecondIconType='user'
            >
                <h6>您好 ~ 用户{userName}</h6>
            </AtNavBar>
            <AtList>
                {
                    goodsList.map((item, index) => {
                        return (
                            <AtListItem
                                key={index + item}
                                title={item.name}
                                note={item.info}
                                thumb={item.img}
                                onClick={() => { clickJump(item.id) }}
                            />)
                    })
                }
            </AtList>
        </View>
    )

}

export default Goods 